<template>
	<view>
		<view class="list">
			<view class="item" v-for="(item, index) in problems" :key="index">
				<view class="problem">
					<text>Q</text>：{{item.tasTitle}}
				</view>
				<view class="anwer">
					<text>A</text>：{{item.tasDetails}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { homeModule } from '../../../modules/home.js'
	import util from '../../../utils/util.js'
	
	const home = new homeModule()
	
	export default {
		data() {
			return {
				problems: []
			};
		},
		onLoad(e) {
			uni.setNavigationBarTitle({
				title: e.tasType
			})
			home.getTaskManual(e.tasType).then((problems)=>{
				this.problems = problems
			})
		}
	}
</script>

<style lang="scss">
	@import "../../../common/scss/common.scss";
	page{
		background-color: #F7F7F7;
	}
	.list {
		margin-top: ws(15);
		background-color: #FFFFFF;
		padding: 0 ws(25);

		.item {
			padding: ws(15) 0;
			border-bottom: 1upx solid #eee;

			&:last-child {
				border-bottom: none;
			}

			.problem {
				font-size: ws(20);

				>text {
					font-weight: bold;
					font-size: ws(22);
					color: #2A83FF;
					margin-right: ws(5);
				}
			}
			
			.anwer{
				font-size: ws(18);
				color: #666;
				
				>text {
					font-weight: bold;
					font-size: ws(20);
					color: #000;
					margin-right: ws(5);
				}
			}
		}

	}
</style>
